<{include file="Business/business_top.html" }>

<script>
	/**
	 * 文本框根据输入内容自适应高度
	 * @param                {HTMLElement}        输入框元素
	 * @param                {Number}                设置光标与输入框保持的距离(默认0)
	 * @param                {Number}                设置最大高度(可选)
	 */
	var autoTextarea = function (elem, extra, maxHeight) {
		extra = extra || 0;
		var isFirefox = !!document.getBoxObjectFor || 'mozInnerScreenX' in window,
				isOpera = !!window.opera && !!window.opera.toString().indexOf('Opera'),
				addEvent = function (type, callback) {
					elem.addEventListener ?
							elem.addEventListener(type, callback, false) :
							elem.attachEvent('on' + type, callback);
				},
				getStyle = elem.currentStyle ? function (name) {
					var val = elem.currentStyle[name];

					if (name === 'height' && val.search(/px/i) !== 1) {
						var rect = elem.getBoundingClientRect();
						return rect.bottom - rect.top -
								parseFloat(getStyle('paddingTop')) -
								parseFloat(getStyle('paddingBottom')) + 'px';
					};

					return val;
				} : function (name) {
					return getComputedStyle(elem, null)[name];
				},
				minHeight = parseFloat(getStyle('height'));

		elem.style.resize = 'none';

		var change = function () {
			var scrollTop, height,
					padding = 0,
					style = elem.style;

			if (elem._length === elem.value.length) return;
			elem._length = elem.value.length;

			if (!isFirefox && !isOpera) {
				padding = parseInt(getStyle('paddingTop')) + parseInt(getStyle('paddingBottom'));
			};
			scrollTop = document.body.scrollTop || document.documentElement.scrollTop;

			elem.style.height = minHeight + 'px';
			if (elem.scrollHeight > minHeight) {
				if (maxHeight && elem.scrollHeight > maxHeight) {
					height = maxHeight - padding;
					style.overflowY = 'auto';
				} else {
					height = elem.scrollHeight - padding;
					style.overflowY = 'hidden';
				};
				style.height = height + extra + 'px';
				scrollTop += parseInt(style.height) - elem.currHeight;
				document.body.scrollTop = scrollTop;
				document.documentElement.scrollTop = scrollTop;
				elem.currHeight = parseInt(style.height);
			};
		};

		addEvent('propertychange', change);
		addEvent('input', change);
		addEvent('focus', change);
		change();
	};
</script>
    </head>
    <body>
	<{include file="Business/business_nav.html" }>
    	<div id="wrap">
    		<div class="intro">
    			<div class="img-box" style="background: url(<{$info.listPic}>) no-repeat;"></div>
				<h3><{$info.storeName}></h3>
				<div class="score">
					<div class="curScore star<{$info.star}>" ></div>
				</div>
				<p>商家简介: <{$info.summary}></p>
    		</div>
    		
    		<div class="tabs">
    			<a href="javascript:void(0);" class="on">
    				<span>商家详情</span>
    			</a>
    			
    			<a href="javascript:void(0);">
    				<span>咨询留言(<{$info.commentNum}>)</span>
    			</a>
    		</div>
    		
    		<div class="tab-container">
    			<!--商家详情-->
    			<div class="content">
    				<div class="section-1">
    					<div class="des">
    						<p class="address"><{$info.address}> 丨 <span class="location" lat="<{$item.latitude}>" lng="<{$item.longitude}>" ></span></p>
    						<p class="time">营业时间: <{$info.openHour}></p>
    					</div>
    					<a href="tel:<{$info.phone}>" class="contact"></a>
    				</div>
    				
    				<div class="section-2 clearfix" style="overflow-x:scroll;overflow-y: hidden">
						<div id="storeAlbum" style="height:1.5rem ;width:<{1.77 * count($album)}>rem;">
						<{foreach from=$album item=img}>
    						<a href="javascript:void(0);" class="img-box" style="background: url(<{$img}>) no-repeat;" data-src="<{$img}>"></a>
						<{/foreach}>
						</div>
    				</div>
    				
    				<!--编辑器内容-->
    				<div class="section-3">
						<{$info.desc}>
    				</div>

					<{if count($package) gt 0}>
    				<div class="package" >
		    			<h3>优惠套餐</h3>
		    			<ul>
							<{foreach from=$package item=onePackage}>
		    				<li>
		    					<a href="<{if $onePackage['jumpURL']}><{$onePackage['jumpURL']}><{else}> <{u('packageDetail?id='|cat:$onePackage['id'])}><{/if}>">
		    						<div class="img-box" style="background: url(<{$onePackage['listPic']}>) no-repeat;"></div>
		    						<div class="detail">
		    							<div class="title"><{$onePackage['title']}></div>
		    							<div class="price">
		    								<span class="oprice">原价: <{$onePackage['priceOriginal']}>元</span>
		    								<span class="cprice">现价: <em><{$onePackage['pricePresent']}></em></span>
		    							</div>
		    							<p>套餐介绍:<{$onePackage['summary']}></p>
		    						</div>
		    					</a>
		    				</li>
		    				<{/foreach}>
		    			</ul>
		    		</div>
					<{/if}>


    			</div>
    			
    			<!--咨询留言-->
    			<div class="content content-2" style="display: none;">
					<{if $info.commentNum gt 0}>
    				<div class="section-4" id="selfSection">
    					<div class="title">我的留言</div>
    					<div class="message-box" >
							<div id="self"></div>
    						<a href="javascript:void(0);" class="more" fixUser="1" >查看更多留言</a>
    					</div>

    				</div>
    				<div class="section-4" id="otherSection">
    					<div class="title">别人的留言</div>
    					<div class="message-box">
							<div id="other"></div>
    						<a href="javascript:void(0);" class="more" fixUser="2">查看更多留言</a>
    					</div>
    				</div>
					<{else}>
<div id="nocomment">还没有任何评论</div>
					<{/if}>
    				
    				<a href="<{u('feedback?id='|cat:$info.id)}>"  class="leaveMsg"></a>

    			</div>
    		</div>
    	</div>

			<div id="footer" class="footer" style="display:none;">
				<!--<textarea id="area" placeholder="添加一条评论"></textarea>-->
				<form id="commentForm">
					<input type="hidden" name="id" value="<{$info.id}>" />
					<input type="hidden" name="type" value="<{$smarty.const.OBJ_TYPE_STORE}>" />
					<input type="hidden" name="parentID" value="0" id="parentID" />
					<input type="hidden" id="nickname" value="" />
					<textarea  name="content" placeholder="添加一条评论" id="area"></textarea>
					<!--输入框有内容的时候调用fs_btn这个类名、没有内容时候没有类名-->
					<input id="btn" type="button" value="发送" onclick="javascript:switchMenu();"/>
				</form>
				<script>
					var text = document.getElementById("area");
					autoTextarea(text);// 调用
				</script>
				<!--<input id="btn" type="submit" value="发送" onclick="javascript:switchMenu();" />-->
			</div>


		<script>
			var page1=1;
			var page2=1;
			$(function () {
				$("#self,#other").click(function(event){
					if($(event.target).hasClass("img-box")){
						event.stopPropagation();
					} else{
						switchMenu();
					}
				});
				$(".food-topic,.inside_con").click(function(){
					offFocus();
				});
				$('#area').on('keyup',changeBtnColor);


				$('.more').click(function(evt){
					var fixUser=$(evt.target).attr("fixUser");
					if(parseInt(fixUser)==1) {
						loadCommont(fixUser, page1);
					}else{
						loadCommont(fixUser, page2);
					}
				})

				<{if $info.commentNum gt 0}>
					loadCommont(1,page1);
					loadCommont(2,page2);
				<{/if}>
			});

			/**
			 * 加载评论
			 */
			function loadCommont(fixUser,page){
				console.log("---------------load comment--------------------")
				$.getJSON("<{u('getComment')}>",{fixUser:fixUser,id:'<{$info.id}>',page:page,pageSize:3} , function(data){
					if(data.status==0){
						if(fixUser==1){
							page1++;
							if (data.total>0) {
								$('#selfSection').show();
								$("#self").append(data.dataHTML);
								showAlbum();    //监听事件
							}
							if(data.isPage==0){
								$('#selfSection .more').hide();
							}
						}else{
							page2++;
							if (data.total>0) {
								$('#otherSection').show();
								$("#other").append(data.dataHTML);
								showAlbum();    //监听事件
							}
							if(data.isPage==0){
								$('#otherSection .more').hide();
							}
						}
					}
				});
			}

			function switchMenu(){
				var footer = document.getElementById('footer');
				if(footer.style.display == '' || footer.style.display == 'block') {
					footer.style.display = "none";
					$('.leaveMsg').show();
				}else{
					footer.style.display = "block";
					$('.leaveMsg').hide();
					$("#area").focus();
					var value = $("#area").val();
					$("#area").val('');
					$("#area").val(value);
				}
				return;
			}

			function offFocus(){
				var div1 = document.getElementById('div1');
				var footer = document.getElementById('footer');
				div1.style.display = "";
				footer.style.display = 'none';
			}


			function changeBtnColor(){
				var content=$("#area").val()
				if($("#parentID").val()>0){
					var nickname='@'+$("#nickname").val()+':';
					if(content.substr(0,nickname.length) == nickname){
						//保持
					}else{
						$("#area").val('');
						$("#parentID").val(0);
						$("#nickname").val('');
						content='';
					}
				}
				if(content == null || content == "" ){
					$("#btn").css("background","");
				}else{
					$("#btn").css("background","#37cbbb");
				}
			}

			function showAlbum(){
				var imgs=new Array();
				var nowImgurl="";
				var imgObj=$(".photo-box a");
				console.log(imgObj);
				for(var i=0; i<imgObj.length; i++){
					imgs.push(imgObj.eq(i).data("src"));
				}
				console.log(imgs);

				imgObj.click(function(){
					nowImgurl = $(this).data("src");
					WeixinJSBridge.invoke("imagePreview",{
						"urls":imgs,
						"current":nowImgurl
					})
				})
			}

    		$(function(){
    			function addLoadEvent(func){ 
			          	var oldonload=window.onload; 
			          	if(typeof window.onload!="function"){
			              window.onload=func(); 
			          	}else{ 
			              window.onload=function(){
		                  	oldonload();
		                  	func(); 
	              		}
		          	}
			    }
			    var imgs=new Array();
			    var nowImgurl="";
			    
			    function getPicInfo(){
			      var imgObj=$(".section-2 a,.photo-box a");
			      for(var i=0; i<imgObj.length; i++){
			        imgs.push(imgObj.eq(i).data("src"));
			      }
			      
			      imgObj.click(function(){
			      	nowImgurl = $(this).data("src");
			      	WeixinJSBridge.invoke("imagePreview",{
			            "urls":imgs,
			            "current":nowImgurl
	            	})
			      })
			    }
			    

			    addLoadEvent(showAlbumDetail);    //监听事件


				function showAlbumDetail(){
					var imgObj=$(".photo-box,#storeAlbum");
					$.each(imgObj,function(i,item){
						var imgs=new Array();
						var nowImgurl="";
						var imgObj=$(item).find('a');
						for(var i=0; i<imgObj.length; i++){
							imgs.push(imgObj.eq(i).data("src"));
						}
						imgObj.click(function(){
							nowImgurl = $(this).data("src");
							WeixinJSBridge.invoke("imagePreview",{
								"urls":imgs,
								"current":nowImgurl
							})
						})
					});
				}
    			
    			$(".tabs a").click(function(){
    				var index = $(this).index();
    				if($(this).hasClass("on")){
    					return
    				}
    				$(this).addClass("on");
    				$(this).siblings().removeClass("on");
    				$(".tab-container .content").hide().eq(index).show();
					if(index==0){
						$('#footer').hide();
						$('.leaveMsg').show();
					}
    			})
    		})




			$("#btn").on('click',function(){
				if($("#area").val() == null || $("#area").val() == "" ){
					return;
				}
				var data=$("#commentForm").serialize();
				$.post("<{u('Comment/addComment')}>",data,function(result){
					if(result.status == 1){
						tip(result.msg);
						return false;
					}else if(result.status == 99){
						window.location.href = result.uri;
					}else {
						//返回结果
						$(window).scrollTop($("#commentDiv").offset().top);
						tip("评论成功");
						if(typeof result.tip!='undefined'){
							tip(result.tip);
						}
						var GETCOMMENTDEFAULTLISTRUI = "<{U('Comment/loadMore')}>&type=<{$smarty.const.OBJ_TYPE_STORE}>&id=<{$info.id}>&pageSize=8";
						$.getJSON(GETCOMMENTDEFAULTLISTRUI, {page: 1}, function (data) {
							if(data.status != 0){
								tip("数据获取失败，请稍后重试或联系管理员解决！");
							}else{
								++page;
								$("#commentDiv").html(data.dataHTML);
								fixUserHead();
								if(data.isPage) loadFlag=1;
							}
						});
					}
				},'json')
			});

			$(".comment").on('click', function(){
				var t = $("#commentDiv").offset().top;
				$(window).scrollTop(t);
			});
			function commentSelect(obj){
				var $obj=$(obj);
				$("#parentID").val($obj.attr('data-id'));
				if($("#nickname").val() == $obj.attr('data-nick')){ return; }

				$("#nickname").val($obj.attr('data-nick'));
				$("#area").val($("#area").val().replace(/@(.*): /, ''));
				$("#area").val('@'+$obj.attr('data-nick')+': ');
			}
			function loadStore() {


			}


    	</script>
	</body>
</html>
